<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <link rel="stylesheet" href="../css/address.css">
    <link rel="stylesheet" href="../css/message.css">
    <title>地址</title>
</head>
<body>
<div id="address">
  <div class="divHead">
    <div class="divTitle">
      <i class="el-icon-arrow-left" @click="goBack"></i>地址管理
    </div>
  </div>
  <div class="divContent">
    <div class="divItem" v-for="(item,index) in addressList" :key="index">
      <div class="divAddress" @click.capture="itemClick(item)">
        <span :class="{spanCompany:item.label === '公司',spanHome:item.label === '家',spanSchool:item.label === '学校'}">{{item.label}}</span>
        <p>
          {{item.detail}}
        </p>
      </div>
      <div class="divUserPhone" @click.capture="itemClick(item)">
        <span>{{item.consignee}}</span>
        <span>{{item.sex === '0' ? '女士' : '先生'}}</span>
        <span>{{item.phone}}</span>
      </div>
      <img src="./../images/edit.png" @click.stop.prevent="toAddressEditPage(item)"/>
      <div class="divSplit"></div>
      <div class="divDefault">
        <img src="./../images/checked_true.png" v-if="item.isDefault === 1">
        <img src="./../images/checked_false.png" @click.stop.prevent="setDefaultAddress(item)" v-else>设为默认地址
      </div>
    </div>
  </div>
  <div class="divBottom" @click="toAddressCreatePage">+ 添加收货地址</div>
</div>
</body>
<script src="../js/vue.js"></script>
<script src="../js/axios.min.js"></script>
<script src="../js/interceptors.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
  new Vue({
    el:"#address",
    data:{
      addressList:[
        //     {
        //     label:'公司',
        //     detail:'金燕龙写字楼 4层电梯口fsdfdsfsdfsdfsssssssssssss（电梯可…）',
        //     consignee:'周先生',//姓名
        //     phone:18544445566,//手机号
        //     isDefault:0,//是否是默认
        // },
      ],
    },
    methods:{

      toAddressEditPage(item){

      },
      goBack(){
        history.go(-1);
      },
      toAddressCreatePage(){
        location.href = "/font/page/address-edit.html";
      },
      getAll(){
        axios.get("/font/address/getAll")
                .then(res =>{
                  if (res.data.code == 20041){
                    this.addressList = res.data.data;
                  }else {
                    this.$message.warning("您还有地址！")
                  }
                })
                .catch(err =>{
                  this.$message.error("接口异常！")
                })
      },
      setDefaultAddress(item){
        axios.put(`/font/address/setDefault/${item.id}`)
                .then(res =>{
                  if (res.data.code == 20031){
                    this.$message.success("设置成功！！！")
                    this.getAll();
                  }else {
                    this.$message.warning("系统异常")
                  }
                })
                .catch(err =>{
                  this.$message.error("接口异常！")
                })
      },
      itemClick(item){
        this.setDefaultAddress(item)
        window.history.go(-1);
      }


    },
    mounted(){
      this.getAll();
    },

  })

</script>
</html>